import React, {useState, useEffect} from 'react'
import * as SvgIcon from '@components/icon/svg'

const Icon = (props) => {
  const { path, width = 16, height = 16, fill = '#666' } = props

  useEffect(() => {
  }, [])

  if (!path) return null

  const iconKey = typeof path === 'number' ? `icon${path}` : path;

  const IconComponent = SvgIcon[iconKey];

  if (!IconComponent) {
    console.warn(`Icon with path "${path}" (resolved to "${iconKey}") not found`);
    return null;
  }

  return <IconComponent width={width} height={height} fill={fill} />;
}

export default Icon;